<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title></title>
		<style type="text/css">
			*{
				padding: 0;
				margin: 0;
			}
			#left{
				width: 400px;
				height: 400px;
				border: 3px solid red;
				margin: 20px;
				position: relative;
				background: url(image/6374601-02201607131502223840.jpg);
				float: left;
			}
			#box{
				width: 220px;
				height: 200px;
				background: wheat;
				opacity: 0.5;
				filter:alpha(opacity=50);
				position: absolute;
				top: 0;
				left: 0;
			}
			#right{
				width: 440px;
				height: 400px;
				border: 3px solid red;
				float: left;
				overflow: hidden;
				position: relative;
			}
			#pic{
				position: absolute;
				top: 0;
				left: 0;
			}
		</style>
	</head>
	<body>
		<div id="left">
			<div id="box"></div>
		</div>
		<div id="right">
			<img src="image/6374601-02201607131502223840(1).jpg" id="pic"/>
		</div>
	</body>
</html>
